<template>
<div class="defa">
<div class='box'>
         <h1>恢复默认设置</h1>
        <el-form :model="restore" ref="restore" label-width="100px" class="demo-ruleForm" size="mini">

                <div class="table">
               <el-col :span=20>
                    <el-form-item >
                        <span slot="label">
                            <span style="color:black; font-size:12px"><strong>恢复默认时间：</strong></span>
                        </span>
                        <div class="block">
                          <el-date-picker
                           v-model="restore.time"
                           type="datetime"
                           placeholder="选择日期时间">
                         </el-date-picker>
                        </div>
                    </el-form-item>
               </el-col>
               <el-col :span=20>
                   <el-form-item>
                       <span slot='label'>
                          <span style="color:black; font-size:14px"><strong>备注：</strong></span>
                        </span>
                        <el-input v-model="restore.input"></el-input>
                   </el-form-item>
               </el-col>
                <div class="btn">
                <el-col>
                <el-button type="danger" @click="open">恢复默认</el-button>
                </el-col>
                </div>
                </div>

        </el-form>
</div>
</div>
</template>
<script>
export default ({
  data () {
    return {
      restore: {
        mimian: '',
        mimu: '',
        visible: false,
        time: '',
        input: ''
      }
    }
  },
  methods: {
    open () {
      this.$confirm('此操作将恢复默认设置该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$message({
          type: 'success',
          message: '操作成功!'
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        })
      })
    }
  }
})
</script>

<style lang='less' scoped>
/deep/el-form demo-ruleform {
  height: 100px;
  font-weight:bold;
  font-size:14px;
}
.defa{
    width: 1200px;
    margin: 0 auto;
    display: flex;
    position: relative;
    height: 670px;
.box{
   margin: 100px 350px;
    height: 500px;
    width: 500px;

.table{
    height: 200px;
}
h1{
    text-align: left;
    border-bottom: 2px solid black;
}

.btn{
    margin-top: 100px ;
    margin-left:150px;
    height: 50px;
    width: 500px;
}
}
}
</style>
